<div class="m-page-title">
	<h2 class="u-tt u-tt-lg">排版元素</h2>
</div>
<div class="m-callout m-callout-warning">
	<div class="m-callout-title">头部标题</div>
	<p>
	用于页面整个功能的描述，一般位于最上方，如当前页面的头部样式。
	</p>
</div>
<div class="u-text">头部标题代码</div>
<div class="m-highlight">
	<pre>&lt;div class=&quot;m-page-title&quot;&gt;<br />		&lt;h2 class=&quot;u-tt&quot;&gt;不定大小的标题&lt;/h2&gt;<br />&lt;/div&gt;<br />&lt;div class=&quot;m-page-title&quot;&gt;<br />	&lt;h2 class=&quot;u-tt u-tt-sm&quot;&gt;固定较小的标题&lt;/h2&gt;<br />&lt;/div&gt;<br />&lt;div class=&quot;m-page-title&quot;&gt;<br />	&lt;h2 class=&quot;u-tt u-tt-md&quot;&gt;固定中等的标题&lt;/h2&gt;<br />&lt;/div&gt;<br />&lt;div class=&quot;m-page-title&quot;&gt;<br />	&lt;h2 class=&quot;u-tt u-tt-lg&quot;&gt;固定较大的标题&lt;/h2&gt;<br />&lt;/div&gt;<br />&lt;div class=&quot;m-page-title&quot;&gt;<br />	&lt;h2 class=&quot;u-tt u-tt-xl&quot;&gt;固定很大的标题&lt;/h2&gt;<br />&lt;/div&gt;</pre>
</div>
<div class="m-callout m-callout-warning">
	<div class="m-callout-title">大段文字</div>
	<p> 大段文字用来放置文字描述信息，一般用作说明等</p>
</div>
<div class="u-text">文字代码</div>
<div class="m-highlight">
	<pre>&lt;div class=&quot;u-text&quot;&gt;文字代码&lt;/div&gt;</pre>
</div>
<div class="m-callout m-callout-warning">
	<div class="m-callout-title">强调标注</div>
	<p> 强调标注为突出背景与文字样式，如当前背景样式，可以将m-callout-warning样式更换为m-callout-danger或者m-callout-info来表示不同颜色</p>
</div>
<div class="u-text">标注代码</div>
<div class="m-highlight">
	<pre>&lt;div class=&quot;m-callout m-callout-warning&quot;&gt;<br />	&lt;div class=&quot;m-callout-title&quot;&gt;强调标注&lt;/div&gt;<br />	&lt;p&gt; 强调标注为突出背景与文字样式，如当前背景&lt;/p&gt;<br />&lt;/div&gt;</pre>
</div>


<div class="m-callout m-callout-warning">
	<div class="m-callout-title">水平文字列表</div>
	<p> 水平文字列表，用于横向的多文字等显示,其中m-list-w1至m-list-w4样式代表不同列表宽度</p>
</div>
<div class="u-text">列表代码</div>
<div class="m-highlight">
	<pre>
&lt;div class=&quot;m-list m-list-w1&quot;&gt;<br />	&lt;ul class=&quot;f-cb&quot;&gt;<br />		&lt;li&gt;文字列表&lt;/li&gt;<br />		&lt;li&gt;文字列表&lt;/li&gt;<br />		&lt;li&gt;文字列表&lt;/li&gt;<br />		&lt;li&gt;文字列表&lt;/li&gt;<br />	&lt;/ul&gt;<br />&lt;/div&gt;
</pre>
</div>

<div class="m-callout m-callout-warning">
	<div class="m-callout-title">代码片段</div>
	<p> 代码片段用于放置代码片段</p>
</div>
<div class="u-text">列表代码</div>
<div class="m-highlight">
	<pre>&lt;div class=&quot;m-highlight&quot;&gt;<br />	&lt;pre&gt;<br />	这里放置代码<br />	&lt;/pre&gt;<br />&lt;/div&gt;</pre>
</div>
